DevExtreme ODataStore Remove 方法 withCredentials 在 React 项目中不起作用 [重复]

Posted 2023-02-27

【中文标题】DevExtreme ODataStore Remove 方法 withCredentials 在 React 项目中不起作用 [重复]

【英文标题】：DevExtreme ODataStore Remove method withCredentials not working in React project [duplicate]

【发布时间】：2020-03-12 15:16:09

【问题描述】：

我遇到了关于从 devextreme odatastore 中删除实体的问题。

我在本地有两个项目，后端项目在 localhost:54602 上运行，前端项目在 localhost:3000 上运行（react app）

我能够在没有 CORS 问题的情况下请求数据。 （CORS 设置在后端进行）

但是当我尝试从 ODataStore 中删除一个实体并在调试模式下查看后端时

context.User.Identity.IsAuthenticated 变量更改为 false。请求失败。

Chrome 控制台输出在这里

从源“http://localhost:3000”访问“http://localhost:54602/units(3)”处的 XMLHttpRequest 已被 CORS 策略阻止：对预检请求的响应未通过访问控制检查：预检请求不允许重定向。

我阅读了有关that link about CORS Preflight的所有信息

我的 CORS 设置在这里。

public void ConfigureServices(IServiceCollection services)
    
        services.AddCors();
        .
        .
        .
    

public void Configure(IApplicationBuilder app, IHostingEnvironment env)
    
        .
        app.UseCors(options =>
            
                options.WithOrigins("http://localhost:3000")
                .WithMethods("GET", "POST", "PUT", "PATCH", "POST", "DELETE", "OPTIONS")
                .AllowAnyHeader()
                .AllowCredentials();
            
        );

        .
    

在反应应用程序中，我正在创建这样的 oDataStore

export default class extends React.Component   

.
.
oDataStore = new ODataStore(

  key: 'Oid',
  version: 4,
  url: 'http://localhost:54602/units',
  withCredentials : true
);

.
.

最后像这样删除调用。

this.oDataStore.remove(this.state.selectedUnit.Oid).then(
                (key) =>  
                  alert(`$key will be delete.`);
                ,
                (error) => 
                 
                  alert(`$error occured.`);
                
              );

我们会接受任何帮助。期待您的回复。

祝你有美好的一天。

【问题讨论】：

我跟踪并看到 GET 请求在后端服务器中有 cookie 标头，但 DELETE 请求没有。 GET 请求 Cookie：[Cookie, SLG_G_WPT_TO=tr; SLG_GWPT_Show_Hide_tmp=未定义； SLG_wptGlobTipTmp=未定义； .AspNetCore.Cookies = CfDJ8N0PK5yNbkJIt5AuELltrwvkU0sDD6NlU94MdqxlH3NXTFlMdGQkZKMKZU6ryRP-sRobcpZ_dtahmM1JMhG_lMXbE5iMNEz_l6E8tHYceY5h2HCK7VpTx2DTb2ksPBo4DDiMMqPsS1ZsL9HszNFOyMtJ0LPG50jqLiEQp_eGnMZ2OVJ6OJxCuCXk7SrtCuQqtspC5iPlyGrCo7L8at_cWPXkxHpzanyrQgYOJYglCn4-toqmaylabyKI4ZasNKTbV8hSKELFfzHx3a9KU4hPTC3uyK1Q8Ivg6hYH6M0oSkUfDQW64MYYvR1l-7ThupueBQ] DELETE请求尚未：（跨度>

【参考方案1】：

我在后端服务器项目中跟踪了输出。

面对这种情况，前端的DELETE请求首先发送OPTIONS请求as documented here。

我目前正在使用这样的中间件。

public void Configure(IApplicationBuilder app, IHostingEnvironment env)

   .
   .
   app.UseMiddleware<UnauthorizedRedirectMiddleware>();
   .

并像这样配置了 OPTIONS 请求。

public async Task InvokeAsync(HttpContext context)
    
        if (context.Request.Method == "OPTIONS")
        
            context.Response.Headers.Add("Access-Control-Allow-Origin", "http://localhost:3000");
            context.Response.Headers.Add("Access-Control-Allow-Credentials", "true");
            context.Response.Headers.Add("Access-Control-Allow-Methods", "DELETE");
            context.Response.Headers.Add("Access-Control-Allow-Headers", "content-type");
            context.Response.StatusCode = (int)HttpStatusCode.OK;
            return;
        

        .
        .
        .
    

2 天没有人回答。我被搜查了。

我希望这些信息可以节省您的时间。

有一个好的编码。

【讨论】：

注意到我，***.com/questions/42168773/… 上面的链接有类似的问题和有关选项预检请求的信息。谢谢。