小编Thi*_*aja的帖子

在 GET 请求 React fetch 中传递有效负载

我正在尝试构建一个 react/node 应用程序,并且试图将从用户输入中获得的值传递给 nodejs api 以调用单独的 api(Instagram API)

我想从 React 应用程序将一个对象附加到 req.body。我想做这样的事情:

app.get('/hashtags', (req,res) => {
   console.log(req.body);
   console.log(req.body.tag);
});
Run Code Online (Sandbox Code Playgroud)

这是我负责上述节点请求的反应应用程序代码:

handleChange(e){
   const searchtag = 'hello';

   fetch('/hashtags', {
     method: 'GET',
     headers: {
       Accept: 'application/json',
       'Content-Type': 'application/json',
     },
     body: JSON.stringify({
       tag: searchtag,
     }),
   })
}
Run Code Online (Sandbox Code Playgroud)

handleChange单击按钮时,我正在调用函数。至于上面的代码,我需要我的节点API调用/hashtagsreq.body.tag = 'hello'(作为我传递'hello'从reactjs)。

但这给了我以下错误:

Uncaught (in promise) TypeError: Failed to execute 'fetch' on 'Window': Request with GET/HEAD method cannot have body.
Run Code Online (Sandbox Code Playgroud)

如果这不能通过这种方式完成:如何将对象req.body从我的反应应用程序附加到节点 api ?

javascript fetch node.js reactjs

5
推荐指数
1
解决办法
1万
查看次数

如何解决Fetch API中的CORS问题

我正在使用reactjs构建仅前端的基本Weather App。对于API请求,我正在使用Fetch API。在我的应用程序中,我从找到的简单API获取当前位置,并且该位置将其作为JSON对象给出。但是,当我通过Fetch API请求它时,出现此错误。

Failed to load http://ip-api.com/json: Request header field Access-Control-Allow-Origin is not allowed by Access-Control-Allow-Headers in preflight response.
Run Code Online (Sandbox Code Playgroud)

因此,我进行了搜索,找到了解决此问题的多种解决方案。

  1. 在Chrome中启用CORS可以解决该错误,但是当我在heroku上部署该应用程序时,如何通过移动设备访问它而又不会遇到相同的CORS问题。
  2. 我找到了启用CORS请求的代理API。但是由于这是一个位置请求,所以这给了我代理服务器的位置。因此,这不是解决方案。
  3. 我已经解决了这个Stackoverflow问题,并将标头添加到我的http请求中的标头中,但是它不能解决问题。(仍然会给出相同的错误)。

那么,如何才能永久解决该问题?我可以用来解决Fetch API中HTTP请求的CORS问题的最佳解决方案是什么?

javascript http cors reactjs fetch-api

5
推荐指数
2
解决办法
1万
查看次数

如何更新 Javascript 中的深层嵌套对象?

我有一个这种类型的 json 对象。

{
    "id": "001",
    "type": "A",
    "value": "aaaaa",
    "data:": {},
    "path": ["001"],
    "children": [
        {
            "id": "002",
            "type": "A",
            "value": "aaaaa",
            "data:": {},
            "path": ["001", "002"],
            "children": []
        },
        {
            "id": "003",
            "type": "A",
            "value": "aaaaa",
            "data:": {},
            "path": ["001", "003"],
            "children": [
                {
                    "id": "00001",
                    "type": "B",
                    "children": []
                }
            ]
        },
        {
            "id": "004",
            "type": "A",
            "value": "aaaaa",
            "data:": {},
            "path": ["001", "004"],
            "children": [
                {
                    "id": "005",
                    "type": "A",
                    "value": "aaaaa",
                    "data:": {},
                    "path": ["001", …
Run Code Online (Sandbox Code Playgroud)

javascript arrays json nested object

5
推荐指数
1
解决办法
2万
查看次数

如何延迟调度动作(去抖)

我有一个场景,我需要在输入完成后两秒调度一个操作。(假设用户在没有 2 秒间隔的情况下输入 1000,因此我需要仅在输入 1000 后以及 2 秒后调度操作)。

以前我使用debounce-promise来做这样的事情,我需要从 API 获取下拉列表,但为此我直接在组件中使用带有 AJAX 调用的库。它工作正常。

现在我需要发送这样的动作。

  // should be dispatched only for the last request
  const getRateReq = dispatch(getRates());

  const getRate = debounce(getRateReq, 2000, {
    leading: false,
  });

  const onChange = (e) => {
     setValue(e.target.value);
     getRate(e.target.value);
  }
Run Code Online (Sandbox Code Playgroud)

现在,该操作仅在完成键入两秒后调度。但随后它会发出 1、10、100、1000 的所有请求(即使输入 1000 时没有两秒间隔)。我怎样才能解决这个问题并只为 2 秒内的最后一个输入调度一个操作?

任何帮助,将不胜感激。谢谢

编辑:添加了基本的 onChange 功能

javascript promise debouncing reactjs redux

3
推荐指数
1
解决办法
2372
查看次数

如何在中间件go-chi中获取url参数

我对特定的路由集使用特定的中间件

r.Route("/platform", func(r chi.Router) {
    r.Use(authService.AuthMiddleware)
    r.Get("/{id}/latest", RequestPlatformVersion)
})
Run Code Online (Sandbox Code Playgroud)

现在我如何访问这个中间件id中的 url 参数AuthMiddleware

func (s *Service) AuthMiddleware(h http.Handler) http.Handler {
    fn := func(w http.ResponseWriter, r *http.Request) {
        fmt.Println(chi.URLParam(r, "id"))
        id := chi.URLParam(r, "id")
        
        if id > 100 {
          http.Error(w, errors.New("Error").Error(), http.StatusUnauthorized)
          return
        }
    }
    return http.HandlerFunc(fn)
}
Run Code Online (Sandbox Code Playgroud)

但是,即使正在运行中间件并且正在调用特定路由,id 参数也会打印为空字符串

parameters url middleware go go-chi

3
推荐指数
1
解决办法
1万
查看次数

如何导航到新页面 react router v4

我正在构建一个加密货币市场应用程序来练习 reactjs。当应用程序启动时,具有某些属性的货币列表将显示为列表。我需要导航到不同的页面(新页面 -货币组件)而不在当前页面底部加载组件。目前我能够在页面底部呈现它。但这不是我需要的。

除了Route to different page[react-router v4] 中提到的方法之外,还有其他方法吗?因为我需要将点击的对象(货币)传递给新的组件(货币)

这是我的CryptoList组件 currency_main.js

import React, { Component } from 'react';
import {
  Table,
  TableBody,
  TableHeader,
  TableHeaderColumn,
  TableRow,
  TableRowColumn,
} from 'material-ui/Table';
import Currency from './currency';
import {
  BrowserRouter as Router,
  Link,
  Route
} from 'react-router-dom'

class CryptoList extends Component {
  constructor(props){
    super(props);
    this.state = {
      currencyList : [],
      showCheckboxes : false,
      selected : [],
      adjustForCheckbox : false
    }
  };

  componentWillMount(){
    fetch('/getcurrencylist',
    {
        headers: {
          'Content-Type': 'application/json', …
Run Code Online (Sandbox Code Playgroud)

javascript reactjs react-router react-router-v4 react-router-dom

2
推荐指数
1
解决办法
1万
查看次数

'keytool'不被识别为内部或外部命令

我使用Ionic创建了一个小型的Android应用程序,我打算构建签名的apk来测试应用程序.

当我在命令提示符下键入'keytool'命令时,我收到此错误

'keytool'不被识别为内部或外部命令,可操作程序或批处理文件.

我尝试使用谷歌搜索和所有解决的问题提到它是JDK的Path变量的问题.我尝试将'JAVA_HOME'变量值更改为'C:\ Program Files\Java\jdk1.8.0_131\bin'和'C:\ Program Files\Java\jre1.8.0_131\bin'并仍然得到相同的错误.

但是,当我运行'keytool'命令时,cmd'C:\ Program Files\Java\jre1.8.0_131\bin'位置,它的工作原理.

谁能帮我这个 ?什么可能是我无法在全球访问它的问题?

java windows android keytool signed-apk

1
推荐指数
1
解决办法
9294
查看次数

如何在不迭代数组的情况下提取对象数组中特定键的值?

假设我有一个像下面这样的对象阵列调用电影.

movies = [{ id : 1,title : 'Black Panther'},{ id : 2,title : 'Avengers'},{ id : 1,title : 'Justice League'},{ id : 4,title : 'Infinity War'},{ id : 5,title : 'Spider man'}]
Run Code Online (Sandbox Code Playgroud)

无论如何我可以从每个对象中提取特定键的值吗?喜欢这个标题数组.

titles = ['Black Panther','Avengers','Justice League','Infinity War','Spider Man']
Run Code Online (Sandbox Code Playgroud)

目前我正在使用map功能.有没有其他方法可以实现这一点,而无需迭代每个对象.这可以通过ES6休息/传播功能实现吗?

javascript arrays array-map ecmascript-6

0
推荐指数
1
解决办法
45
查看次数

React应用上的Google Analytics(分析)不起作用

我将我的投资组合(仍在开发中)托管在github页面上。它只是一个具有静态内容的Web应用程序。而且我需要将Google Analytics(分析)添加到我的投资组合中并获得访问次数(主要是为了熟悉该过程)。我发现了react-ga模块,该模块可用于在React Apps(使用create-react-app创建)上配置Google Analytics(分析)。

然后按照教程进行配置和托管。我检查了网站的测试流量,但Google Analytics(分析)仪表板没有更新。可能是什么情况?它应该按照教程工作。由于我是Google Analytics(分析)的新手,因此我很难找出问题所在。

这是我的App.js

import React, { Component } from "react";
import HeaderList from "./components/Header";
import "./App.css";
import { Layout } from "antd";
import { Router, Route, Switch } from "react-router-dom";
import createHistory from "history/createBrowserHistory";
import ReactGA from 'react-ga';
import Keys from './config/keys';

import AboutMe from "./components/AboutMe";
import Skills from "./components/Skills";
import Contact from "./components/Contact";
import Projects from "./components/Projects";

const { Content } = Layout;
ReactGA.initialize(Keys.GOOGLE_TRACKING_ID); //Unique …
Run Code Online (Sandbox Code Playgroud)

google-analytics reactjs react-router create-react-app react-router-dom

0
推荐指数
1
解决办法
2248
查看次数