Question

我在react.js中使用meteor.js来渲染地图，但我需要确保没有人使用我的秘密令牌，而是传入一些安全变量。目前，/client/main.js的以下代码在客户端上完成。我试过把它复制过来，但我得到了ReferenceError: document is not defined。如何在服务器上实现此代码？

来自/client/main.js

import React from 'react';
import ReactDOM from 'react-dom';

var NewComponent = React.createClass({
  render: function() {
    return (
      <div id="map" />
    );      
  },
  componentDidMount: function() {
    var $this = $(ReactDOM.findDOMNode(this));
    // SEE BELOW FOR THE TOKEN...
    L.mapbox.accessToken = 'pk.eyJ1IjsecretxODBxMDA4dHU0bTVwOThiNjBqbCJ9.ALkY_spgnw5ZqOtoken';
    var map = L.mapbox.map('map', 'mapbox.streets').setView([40, -74.50], 9);   
  },  
});

Meteor.startup(() => {
    ReactDOM.render(<NewComponent />, document.getElementById('map-container'));
});

来自/client/main.html

<head>
  <title>Todo List</title>
  <script src="https://maps.googleapis.com/maps/api/js?key=secret3tze-UVizTCUDjAhtoken71zY&libraries=places" async defer></script>
  <script src='https://api.mapbox.com/mapbox.js/v2.4.0/mapbox.js'></script>
    <link href='https://api.mapbox.com/mapbox.js/v2.4.0/mapbox.css' rel='stylesheet' />
</head>

<body>
  <div id="map-container"></div>
</body>

渲染React服务器端

0 个答案: