首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
社区首页 >问答首页 >使用angular 4集成woocommerce获取TypeError: crypto.createHmac不是一个函数

使用angular 4集成woocommerce获取TypeError: crypto.createHmac不是一个函数
EN

Stack Overflow用户
提问于 2018-05-27 04:11:24
回答 1查看 173关注 0票数 1

我正在尝试做一个与woocommerce集成的angular 4应用程序来列出所有的产品。以下是我的代码

代码语言:javascript
运行
AI代码解释
复制
import { Component, OnInit } from '@angular/core';
import {Headers, Http, RequestOptions, URLSearchParams} from '@angular/http';
import 'rxjs/add/operator/toPromise';
import * as WC from 'woocommerce-api';
import { WooApiService } from 'ng2woo';
import * as CryptoJS from 'crypto-js';
@Component({
selector: 'app-pcat',
templateUrl: './pcat.component.html',
styleUrls: ['./pcat.component.scss']
})
export class PcatComponent implements OnInit {
WooCommerce: any;
products: any;
public crypto: any;
typesOfShoes = ['Boots', 'Clogs', 'Loafers', 'Moccasins', 'Sneakers'];
constructor(private woo: WooApiService) {}
ngOnInit(): void  {
this.woo.fetchItems('products')
.then(products => console.log(products));
}}

我在控制台中遇到错误

代码语言:javascript
运行
AI代码解释
复制
Error: Uncaught (in promise): TypeError: crypto.createHmac is not a function
TypeError: crypto.createHmac is not a function
hash_function@webpack-internal:///../../../../woocommerce-api/index.js:133:16
OAuth.prototype.getSignature@webpack-internal:///../../../../oauth-1.0a/oauth-1.0a.js:100:12
OAuth.prototype.authorize@webpack-internal:///../../../../oauth-1.0a/oauth-1.0a.js:87:34
WooCommerceAPI.prototype._request@webpack-internal:/woocommerce-api/index.js:186:17
WooCommerceAPI.prototype.get@webpack-internal:/woocommerce-api/index.js:213:10
fetchItems/<@webpack-internal:/ng2woo/dist/src/woocommerce.service.js:24:13
ZoneAwarePromise@webpack-internal:/zone.js/dist/zone.js:891:29
EN

回答 1

Stack Overflow用户

发布于 2019-03-13 17:34:09

是的,这个问题与最近在Angular6中的“升级”有关,在我的例子中是Ionic4。密码库被排除在外,因为它被认为太大了。对于如何解决这个问题,Angular似乎还没有明确的解决方案,所以到目前为止,人们不得不在外部包含这些库。

最有可能的是你添加了一些类似于我下面的"package.json“的东西,甚至到了这一步。

代码语言:javascript
运行
AI代码解释
复制
"browser": {
    "aws4": false,
    "aws-sign2": false,
    "crypto": false,
    "ecc-jsbn": false,
    "http": false,
    "http-signature": false,
    "https": false,
    "net": false,
    "oauth-sign": false,
    "path": false,
    "request": false,
    "sshpk": false,
    "stream": false,
    "tls": false
  },

我也尝试过,但没有成功。

1-安装@angular-builders/custom-webpack

2-在angular.json中添加自定义构建器:在angular.json >项目>架构师> build > builder将@angular-devkit/build-angular:browser替换为@angular-builders/ custom -browser

3-在项目的根目录创建一个文件webpack.config.js :这将由新的构建器加载(默认情况下,文件名是webpack.config.js,但如果需要,您可以有一个自定义的文件名,请参阅此处)。注意:这会将你的配置附加到默认的来自angular的webpack配置。

4-在webpack.config.js中添加节点支持:例如,web3需要以下内容。

代码语言:javascript
运行
AI代码解释
复制
module.exports = {
  node: {
    crypto: true,
    http: true,
    https: true,
    os: true,
    vm: true,
    stream: true
  }
}

我最终创建了woocommerceAPI,并且我有了一个可以工作的版本。我发现至少有40个fork做过类似的事情。在下面的代码和浏览器之间,它应该可以工作。风俗的webpack是没有必要的。

Modified WooCommerceAPI

票数 0
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/50548946

复制
相关文章
woocommerce根据标题获取相关产品
  我们知道woocommerce的相关文章是根据分类category或标签tag来获取的,能不能实现根据标题来调取相关产品呢?get_posts() 函数可以根据库存、价格、自定义项、搜索条件等不同的标准来显示不同的相关产品,如何操作呢?随ytkah一起来看看
ytkah
2019/12/19
1.6K0
Angular 使用 Resolve 预先获取组件数据
这几天碰到一个需求,登录后要根据用户信息的不同跳转到不同的页面。 比如默认登录要求跳转到A页面,如果A的页面中表格数据是空则要求登录后要直接跳转到B页面。 如果在pageA的组件中的ngInit中判断,你会先看到pageA然后再跳到pageB,这样用户体验不太好。 这就要求在路由变化发生之前就要拿到后台返回的数据。这个时候我们可以使用Resolve 实现起来也比较简单
mafeifan
2019/05/31
1.6K0
使用CircleCI2.0持续集成Angular项目
这种事情完全可以交给CircleCI来处理。 CircleCI的好处(截止当前的政策2019.2):
mafeifan
2019/03/11
8380
使用CircleCI2.0持续集成Angular项目
angular获取dom元素
方式一: ViewChild <div #box></div> @ViewChild('box') box: ElementRef; constructor(){ // 不能放在构造函数里面这个时候构造函数中还没有视图没法获取到box元素 } ngOnInit() { console.log(this.box.nativeElement); } 方式二: ElementRef <div class="box"></div> constructor(private el:ElementRef){
用户1437675
2019/05/15
4.3K0
Angular4记账webApp练手项目之二(在angular4项目中使用Angular WeUI)
安装后还需要引用weui 样式以及我们的font-awesome图标苦,在我们项目index.html中引用
易兒善
2018/08/21
2.2K0
Angular4记账webApp练手项目之二(在angular4项目中使用Angular WeUI)
angular4实战(4)ngrx
版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/j_bleach/article/details/78161765
j_bleach
2019/07/02
1.2K0
angular4实战(4)ngrx
Angular 4 组件通信
最近在项目上,组件跟组件之间可能是父子关系,兄弟关系,爷孙关系都有。。。。。我也找找了很多关于组件之间通讯的方法,不同的方法应用在不同的场景,根据功能需求选择组件之间最适合的通讯方式。下面我就总结一下关于组件通讯的N多种方法。
半指温柔乐
2020/06/10
9190
忘记 Angular 3:Google 将发布 Angular 4
2016年11月,当Google详细说明将在Angular 2到来的短短6个月后发布Angular 3的计划时,每个人都大吃一惊。现在,事实证明终究“No Angular 3”发布。相反,Google将于2017年3月正式推出其流行的JavaScript框架的第4版。
疯狂的技术宅
2019/03/28
1K0
忘记 Angular 3:Google 将发布 Angular 4
angular4实战(1) angular-cli
版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/j_bleach/article/details/78077403
j_bleach
2019/07/02
6780
angular4实战(1) angular-cli
为什么我们选择使用 React 而不是 Angular 构建新 UI
我们在2013年推出了Cloud Elements集成平台的v1版本,这个产品在过去几年里一直为客户和公司发展提供了良好的服务。但是2017年,Web技术迅速演变,从而使用户期望也进一步发展。现在是我们重新思考整个开发者流程的时候了,这也为我们重新思考我们的技术栈提供了一个机会。 在产品发布周期和发布期限的世界中,技术的选择至关重要。以下是我们一路走来的历程,帮助你揭开一些关于React的实用亮点。 我们来自哪里 在React之前,我们使用AngularJS,这可能是当时被选中的最流行的前端框架。 但是如
顶级程序员
2018/05/03
2.7K0
为什么我们选择使用 React 而不是 Angular 构建新 UI
为什么我们选择使用 React 而不是 Angular 构建新 UI
我们在2013年推出了Cloud Elements集成平台的v1版本,这个产品在过去几年里一直为客户和公司发展提供了良好的服务。但是2017年,Web技术迅速演变,从而使用户期望也进一步发展。现在是我们重新思考整个开发者流程的时候了,这也为我们重新思考我们的技术栈提供了一个机会。 在产品发布周期和发布期限的世界中,技术的选择至关重要。以下是我们一路走来的历程,帮助你揭开一些关于React的实用亮点。
疯狂的技术宅
2019/03/28
2.3K0
为什么我们选择使用 React 而不是 Angular 构建新 UI
Pycharm集成PyQt4并使用
?
marsggbo
2018/01/23
9180
Pycharm集成PyQt4并使用
(4)Angular的开发
angular框架,库,是一款非常优秀的前端高级JS框架,有了这个框架就可以轻松构建SPA应用程序,通过指令宽展了HTML,通过表达式绑定数据到HTML。
达达前端
2019/07/22
3.1K0
[C++模版] 判断函数入参是不是一个lambda
https://lewissbaker.github.io/2022/08/27/understanding-the-compiler-transform#introduction
望天
2023/02/23
3.3K0
Woocommerce Trends 2020
Top Woocommerce Trends To Follow In 2020. If you have an online store and missed out on the last annual Woosesh virtual conference held a few months ago, then you’re short of information in updating yourself with the latest trends of Woocommerce.
用户4822892
2019/12/10
6030
Woocommerce Trends 2020
Serverless 时代,这才是Web应用开发正确的打开方式 | Q推荐
如同 iPhone 当年颠覆了诺基亚,Serverless 的出现也带来了一种全新的、颠覆式的云开发架构模式。在 Serverless 出现前,开发者们根本无法想象几分钟就能快速部署一个 Web 应用上线。近日,亚马逊云科技 Tech Talk 特别邀请了资深无服务器技术专家孙华带来分享《 如何高效、极简构造无服务器 Web 应用》。孙华以 Amazon Lambda 的视角介绍了无服务器 Web 应用的构造方式,并讲述了如何利用最新发布的 Lambda Function URLs 和 Lambda Adapter 进一步简化无服务器 Web 应用的开发和调试并且实现 Web 应用在 Lambda,Fargate 和 EC2 等计算平台之间平滑迁移。
深度学习与Python
2022/06/13
3.6K0
Serverless 时代,这才是Web应用开发正确的打开方式 | Q推荐
点击加载更多

相似问题

TypeError: crypto.createHmac不是一个函数

18

Woocommerce TypeError:$(.).on不是函数

11

Angular:获取对象:TypeError(...)不是函数

10

Angular 4: TypeError: this.function不是一个函数

122

this.changeHook 4- TypeError: Angular不是一个函数

12
添加站长 进交流群

领取专属 10元无门槛券

AI混元助手 在线答疑

扫码加入开发者社群
关注 腾讯云开发者公众号

洞察 腾讯核心技术

剖析业界实践案例

扫码关注腾讯云开发者公众号
领券
社区富文本编辑器全新改版!诚邀体验~
全新交互,全新视觉,新增快捷键、悬浮工具栏、高亮块等功能并同时优化现有功能,全面提升创作效率和体验
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档
查看详情【社区公告】 技术创作特训营有奖征文