草庐IT

关于javascript：从JS访问REST API

codeneng 2023-03-28 原文

Access to REST API from JS

需要从 JS 代码访问 REST API，使用 jQuery ajax:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
function tryQwintry () {
    var data = {
       "params[weight]" :"100",
       "params[dimensions]" :"100x100x100",
       "params[delivery_pickup]" :"msk_1",
       "params[insurance]" :"false",
       "params[items_value]" :"350",
       "params[retail_pricing]" :"1"
    };

    $.ajax({
        url:"http://logistics.qwintry.com/api/cost",
        type:"POST",
        dataType:"jsonp",
        contentType:"application/json",
        headers: {"Authorization":"Bearer" + MY_API_KEY},
        data: data,
        success: function (cost) {
            console.log("стоимость доставки $"+cost);
        },
        error: getErrorMsg
    });
}

API 文档(所有示例均为 PHP)：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
<?php
    define('SITE_URL', 'logistics.qwintry.com');
    define('API_KEY', 'YOUR_API_KEY'); //don't forget to set your key!

    $url =  'http://'. SITE_URL .'/api/cost';


    $data = array (
        'params' => array(
            'weight' => 5, // in lb
            'delivery_pickup' => 'msk_1', // full list of pickup points can be retrieved from /api/locations-list
            'insurance' => true,
            'items_value' => 500, // declaration items total cost in USD
            'retail_pricing' => true // retail / wholesale pricing?
        ),
     );
    $data_string = http_build_query($data);

    $ch = curl_init();
    curl_setopt($ch, CURLOPT_URL, $url);
    curl_setopt($ch, CURLOPT_RETURNTRANSFER, 1);
    curl_setopt($ch, CURLOPT_HTTPHEADER, array('Authorization: Bearer '. API_KEY));
    curl_setopt($ch, CURLOPT_POST, true);
    curl_setopt($ch, CURLOPT_POSTFIELDS,  $data_string);
    curl_setopt($ch, CURLOPT_SSL_VERIFYHOST, 0);
    curl_setopt($ch, CURLOPT_SSL_VERIFYPEER, 0);
    $response = curl_exec($ch);
    curl_close($ch);
    var_dump($response);

我用 Java 编写的代码相同：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
public double getCostPickup(String weight, String dimensions, String toPickup, String insurance, String value) throws Exception {

    Map<String, Object> params = new HashMap<>();
    params.put("params[weight_kg]", weight);
    params.put("params[dimensions_cm]", dimensions);
    params.put("params[delivery_pickup]", toPickup);
    params.put("params[insurance]", insurance);
    params.put("params[items_value]", value);
    params.put("params[retail_pricing]", RETAIL_PRICING);

    String url = BASE_URL+"/api/cost";
    HttpResponse<JsonNode> jsonResponse = Unirest.post(url).fields(params).asJson();
    return getCost(jsonResponse, insurance);
}

配置ajax请求数据有问题。
所以任何帮助将不胜感激。

更新：更改了我的 JS 代码：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
function tryQwintry () {
    var data = {
       "params[weight]" :"100",
       "params[dimensions]" :"100x100x100",
       "params[delivery_pickup]" :"msk_1",
       "params[insurance]" :"false",
       "params[items_value]" :"350",
       "params[retail_pricing]" :"1"
    };

    $.ajax({
        url:"http://logistics.qwintry.com/api/cost",
        type:"POST",
        dataType:"json",
        contentType:"application/json",
        headers: {"Authorization" :"Bearer"+MY_API_KEY,"Access-Control-Allow-Origin" :"true"},
        data: JSON.stringify(data),
        success: function (cost) {
            console.log("стоимость доставки $"+cost);
        },
        error: getErrorMsg
    });
}

在 Chrome 的开发者模式下出现此错误：

  • 您不能使用 jsonp 使用 POST 请求。设置 GET 请求或不使用 jsonp
  • 它的 POST 请求，但是它的跨域请求
  • 所以将 jsonp 替换为 json 作为数据类型。再次如前所述，无法将 POST 用于 jsonp stackoverflow.com/a/3860117/1414562

你在使用 CORS 请求吗？

如果不是，则将数据类型更改为 "json" 而不是 "dataType: "jsonp"。

如果您正在执行 CORS，则启用 CORS 请求，那么您需要添加 php 代码以允许 CORS 请求。

1
header("Access-Control-Allow-Origin: *");

使用 php 标头检查此链接 CORS

Json 数据格式：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
 var data = {
        weight : 100,
        dimensions :"100x100x100",
        delivery_pickup :"msk_1",
        insurance : false,
        items_value : 350,
        retail_pricing : 1
    };

$.ajax({
    url:"http://logistics.qwintry.com/api/cost",
    dataType:"jsonp",
    contentType:"application/json",
    headers: {"Authorization":"Bearer" + MY_API_KEY},
    data: JSON.stringify(data),
    success: function (cost) {
        console.log("стоимость доставки $"+cost);
    },
    error: getErrorMsg
});

注意：JOSNP

不允许使用方法："POST"

  • 首先，是的，它的 CROS 请求。不要介意 PHP 代码，它只是 API 文档中的示例，我需要正确配置 JS

javascriptRESTspanclassnbspapijqueryphprest

有关关于javascript：从JS访问REST API的更多相关文章

  1. ruby - 为什么我可以在 Ruby 中使用 Object#send 访问私有(private)/ protected 方法？ - 2

    类classAprivatedeffooputs:fooendpublicdefbarputs:barendprivatedefzimputs:zimendprotecteddefdibputs:dibendendA的实例a=A.new测试a.foorescueputs:faila.barrescueputs:faila.zimrescueputs:faila.dibrescueputs:faila.gazrescueputs:fail测试输出failbarfailfailfail.发送测试[:foo,:bar,:zim,:dib,:gaz].each{|m|a.send(m)resc

  2. ruby-on-rails - 在混合/模块中覆盖模型的属性访问器 - 2

    我有一个包含模块的模型。我想在模块中覆盖模型的访问器方法。例如:classBlah这显然行不通。有什么想法可以实现吗？ 最佳答案 您的代码看起来是正确的。我们正在毫无困难地使用这个确切的模式。如果我没记错的话，Rails使用#method_missing作为属性setter，因此您的模块将优先，阻止ActiveRecord的setter。如果您正在使用ActiveSupport::Concern(参见thisblogpost)，那么您的实例方法需要进入一个特殊的模块:classBlah

  3. ruby - 续集在添加关联时访问many_to_many连接表 - 2

    我正在使用Sequel构建一个愿望list系统。我有一个wishlists和itemstable和一个items_wishlists连接表(该名称是续集选择的名称)。items_wishlists表还有一个用于facebookid的额外列(因此我可以存储opengraph操作)，这是一个NOTNULL列。我还有Wishlist和Item具有续集many_to_many关联的模型已建立。Wishlist类也有:selectmany_to_many关联的选项设置为select:[:items.*,:items_wishlists__facebook_action_id].有没有一种方法可以

  4. ruby - 有没有办法从 ruby​​ case 语句中访问表达式？ - 2

    我想从then子句中访问c​​ase语句表达式，即food="cheese"casefoodwhen"dip"then"carrotsticks"when"cheese"then"#{expr}crackers"else"mayo"end在这种情况下，expr是食物的当前值(value)。在这种情况下，我知道，我可以简单地访问变量food，但是在某些情况下，该值可能无法再访问(array.shift等)。除了将expr移出到局部变量然后访问它之外，是否有直接访问caseexpr值的方法？罗亚附注我知道这个具体示例很简单，只是一个示例场景。 最佳答案

  5. ruby - 从外部访问类的实例变量 - 2

    我理解(我认为)Ruby中类变量和类的实例变量之间的区别。我想知道如何从该类外部访问该类的实例变量。从内部(即在类方法中而不是实例方法中)，它可以直接访问，但是从外部，有没有办法做MyClass.class.[@$#]variablename?我没有任何具体原因要这样做，只是学习Ruby并想知道是否可行。 最佳答案 classMyClass@my_class_instance_var="foo"class上述yield:>>foo我相信Arkku演示了如何从类外部访问类变量(@@)，而不是类实例变量(@)。我从这篇文章中提取了上述内

  6. ruby-on-rails - 使用 HTTP.get_response 检索 Facebook 访问 token 时出现 Rails EOF 错误 - 2

    我试图在我的网站上实现使用Facebook登录功能，但在尝试从Facebook取回访问token时遇到障碍。这是我的代码:ifparams[:error_reason]=="user_denied"thenflash[:error]="TologinwithFacebook,youmustclick'Allow'toletthesiteaccessyourinformation"redirect_to:loginelsifparams[:code]thentoken_uri=URI.parse("https://graph.facebook.com/oauth/access_token

  7. ruby-on-rails - 使用 javascript 更改数据方法不会更改 ajax 调用用户的什么方法？ - 2

    我遇到了一个非常奇怪的问题，我很难解决。在我看来，我有一个与data-remote="true"和data-method="delete"的链接。当我单击该链接时，我可以看到对我的Rails服务器的DELETE请求。返回的JS代码会更改此链接的属性，其中包括href和data-method。再次单击此链接后，我的服务器收到了对新href的请求，但使用的是旧的data-method，即使我已将其从DELETE到POST(它仍然发送一个DELETE请求)。但是，如果我刷新页面，HTML与"new"HTML相同(随返回的JS发生变化)，但它实际上发送了正确的请求类型。这就是这个问题令我困惑的

  8. ruby-on-rails - 关于 Ruby 的一般问题 - 2

    我在我的rails应用程序中安装了来自github.com的acts_as_versioned插件，但有一段代码我不完全理解，我希望有人能帮我解决这个问题class_eval我知道block内的方法(或任何它是什么)被定义为类内的实例方法，但我在插件的任何地方都找不到定义为常量的CLASS_METHODS，而且我也不确定是什么here，并且有问题的代码从lib/acts_as_versioned.rb的第199行开始。如果有人愿意告诉我这里的内幕，我将不胜感激。谢谢-C 最佳答案 这是一个异端。http://en.wikipedia

  9. ruby - 使用 Class.new 时访问外部范围 - 2

    是否有可能以某种方式访问​​Class.new范围内的a？a=5Class.new{defb;aend}.new.b#NameError:undefinedlocalvariableormethod`a'for#:0x007fa8b15e9af0>#:in`b' 最佳答案 即使@MarekLipka的回答是正确的——改变变量范围总是有风险的。这是可行的，因为每个block都带有创建它的上下文，因此您的局部变量a突然变得不那么局部了——它变成了一个“隐藏的”全局变量:a=5object=Class.new{define_method(

  10. ruby - 使用访问器方法即时创建对象 - 2

    使用散列定义的访问器方法动态创建对象的最简单方法是什么？例如，如果我有一个散列:{foo:"Foo",bar:"Bar"}我想要一个具有访问器方法foo、foo=、bar和bar=的对象，其初始值分别为"Foo"和"Bar"。我可以想到这样做:moduleObjectWithAccessordefself.newh;Struct.new(*h.keys).new(*h.values)endendo=ObjectWithAccessor.new(foo:"Foo",bar:"Bar")o.foo#=>"Foo"但是，我不需要它们的多个实例具有相同的特定键集，而是希望每次都使用可能不同的键

随机推荐