react-native - 使用 apollo-link-rest 发送纯文本请求正文
问题描述
我正在尝试向一个端点发送一个 POST 请求,该端点需要一个application/x-www-form-urlencoded
Content-Type
带有模块的表单数据和一个纯文本字符串,apollo-link-rest
并且遇到了最困难的时间。
在 cURL 表单中,我想要发出的请求如下所示:
curl -X POST http://tld.com/search -d include_all=My%20Search%20Term
我已经像这样将我的主要组件包装在graphql
HOC 中react-apollo
。
export default graphql(gql`
mutation productSearch($input: string) {
search(input: $input) @rest(
path: "/search",
method: "post",
endpoint: "search",
bodySerializer: "search"
) {
total
}
}
`,
{
props: ({ mutate }) => ({
runSearch: (text: string) => {
if (mutate) {
mutate({
variables: {
input: `include_all=${encodeURIComponent(text)}`,
},
});
}
},
}),
})(SearchResults);
查询bodySerializer
中引用的搜索如下所示。
const searchSerializer = (data: any, headers: Headers) => {
headers.set('Content-Type', 'application/x-www-form-urlencoded');
return { body: data, headers };
};
然后runSearch
在我的组件中调用了这样的函数。
async componentDidMount() {
try {
const result = await this.props.runSearch(this.props.searchText);
} catch (error) {
// report error & show message
}
}
现在我意识到我没有对结果做任何事情,但是在运行搜索代码时似乎有一个未处理的承诺拒绝(这是 React Native 用黄色框警告告诉我的)。我也在用 Reactotron 检查请求,请求看起来不错,但仍然失败。我想知道我是否遗漏了我的配置apollo-link-rest
方式,或者是否有更好的方法可以检查来自 Apollo 客户端的请求。
在这里的任何帮助将不胜感激。谢谢!
解决方案
所以事实证明我上面的所有设置都正确。react-apollo
我的 Info.plist 文件不是问题,而是问题。我没有启用 iOS 应用程序发出 HTTP 请求的能力。它只允许HTTPS。我用我的 Info.plist 中的这个条目修复了它。
<key>NSAppTransportSecurity</key>
<dict>
<key>NSAllowsArbitraryLoads</key>
<true/>
</dict>
推荐阅读
- reactjs - Redux-firebase:如何访问从未使其状态的调度操作的有效负载?
- javascript - 如何一直滚动到滚动条底部(目前忽略最后两个添加的项)
- spring-boot - 不能自动装配 JobLauncher,总是返回 null
- angular - Angular/Karma 单元测试错误“1 个计时器仍在队列中”
- javascript - Chrome 和 IE 中的 Intl.NumberFormat 输出不同
- vba - 访问 VBA 子窗体动态 SQL 父窗体计数慢
- ruby - CSS 样式和链接不适用于 gitlab CI 的 jekyll 部署
- sql - SQL:检索不同列的不同
- excel - 如何使用 VBA 自动浏览网页?
- reactjs - 如何调用 Power BI Embedded API