Heads up! We're sunsetting this forum to streamline our community space.

join us on Discord for support, updates, and all things Snap AR! See you there!
Sign up for our live Camera Kit office hour on July 17 @ 9:30am (PT) / 4:30pm (GMT)

Is there any way to use snapchat camera kit with react native?

newzera dev
newzera dev Posts: 11 🔥
in General #1

Currently, we have successfully done it for android by creating a native module for snapchat camera kit (it launches camera kit on pressing a button). But we are facing issues in doing same thing for ios.

Best Answer

  • stevenxu
    stevenxu Posts: 612 👻
    #2 Answer ✓

    @newzera dev We currently don't have official support for react native, but we have seen other developers are able to use it. Our team is aware of this request, you can add a vote up to it [here] for our PMs :) (https://community.snap.com/snapar/discussion/851/react-native-integration#latest)

    In the meantime, could you share more details on the issue you're having for iOS?

    Also great to hear you got it working for android!! If you are comfortable with it, feel free to share here for other developers that may want to give it a try.

Answers

  • Tushar
    Tushar Posts: 3
    #3

    Hi @stevenxu and @newzera dev I am also facing this issue

  • Tushar
    Tushar Posts: 3
    edited November 2022 #4

    Is this even possible? As a prior step I am unable to even reproduce the sample camera kit app functionality as per https://github.com/Snapchat/camera-kit-reference/tree/main/samples/ios/CameraKitSample. If I download the repo and/or copy all of it then it works! However, when I use the exact same code in another fresh xcode project, it just gives me a black screen even though it says it has camera and microphone access!
    Please see these error logs and maybe you or you can pass this on to your engineering team thanks!

    2022-11-15 02:37:06.492615-0600 test[8909:1301916] Metal API Validation Enabled
2022-11-15 02:37:06.600981-0600 test[8909:1303558] Task <DFCF4CCD-2746-414B-BB37-46A705123166>.<1> finished with error [-1001] Error Domain=NSURLErrorDomain Code=-1001 "The request timed out." UserInfo={_kCFStreamErrorCodeKey=-2102, NSUnderlyingError=0x281b44d20 {Error Domain=kCFErrorDomainCFNetwork Code=-1001 "(null)" UserInfo={_kCFStreamErrorCodeKey=-2102, _kCFStreamErrorDomainKey=4}}, _NSURLErrorFailingURLSessionTaskErrorKey=LocalDataTask <DFCF4CCD-2746-414B-BB37-46A705123166>.<1>, _NSURLErrorRelatedURLSessionTaskErrorKey=(
    "LocalDataTask <DFCF4CCD-2746-414B-BB37-46A705123166>.<1>"
), NSLocalizedDescription=The request timed out., NSErrorFailingURLStringKey=https://api.snapkit.com/v1/config, NSErrorFailingURLKey=https://api.snapkit.com/v1/config, _kCFStreamErrorDomainKey=4}
2022-11-15 02:37:06.862293-0600 test[8909:1301916] Unknown CIDetectorNumberOfAngles specified. Ignoring.
[SG][I] CORE: OpenGL Version string: OpenGL ES 3.0 Metal - 99
[SG][I] CORE: SG GL Version: 30
[SG][I] [GL::Device] platformDeviceString: Apple Inc. Apple A14 GPU OpenGL ES 3.0 Metal - 99[SG][I] CORE: OpenGL Version string: OpenGL ES 3.0 Metal - 99
[SG][I] CORE: SG GL Version: 30
Thread Performance Checker: -[AVCaptureSession startRunning] should be called from background thread. Calling it on the main thread can lead to UI unresponsiveness
PID: 8909, TID: 1301916
Backtrace
=================================================================
3   SCSDKCameraKit                      0x000000010385d0c0 $sSo31SCCameraKitAdjustmentsProcessorP011SCSDKCameraB0E5apply10adjustment10ControllerQyd__qd___tKAC10AdjustmentRd__lF + 292456
4   test                                0x00000001000edd38 $s25SCSDKCameraKitReferenceUI16CameraControllerC15configureLenses11orientation24textInputContextProvider022agreementsPresentationlM0ySo25AVCaptureVideoOrientationV_So08SCCamerab4TextklM0_pSgSo0sb10AgreementsolM0_pSgtF + 372
5   test                                0x00000001000ed848 $s25SCSDKCameraKitReferenceUI16CameraControllerC9configure11orientation24textInputContextProvider022agreementsPresentationkL010completionySo25AVCaptureVideoOrientationV_So08SCCamerab4TextjkL0_pSgSo0sb10AgreementsnkL0_pSgyycSgtFyycfU_ + 152
6   test                                0x00000001000edba8 $s25SCSDKCameraKitReferenceUI16CameraControllerC23promptForAccessIfNeeded33_2B69E4D9F2A5E2DE2FABD7EA72A68F67LL10completionyyyc_tF + 592
7   test                                0x00000001000ed610 $s25SCSDKCameraKitReferenceUI16CameraControllerC9configure11orientation24textInputContextProvider022agreementsPresentationkL010completionySo25AVCaptureVideoOrientationV_So08SCCamerab4TextjkL0_pSgSo0sb10AgreementsnkL0_pSgyycSgtF + 256
8   test                                0x0000000100104e58 $s25SCSDKCameraKitReferenceUI20CameraViewControllerC5setup33_6A92036BEEA7E6C1935EFC1B900A834FLLyyF + 308
9   test                                0x0000000100104cf8 $s25SCSDKCameraKitReferenceUI20CameraViewControllerC11viewDidLoadyyF + 84
10  test                                0x0000000100104fb0 $s25SCSDKCameraKitReferenceUI20CameraViewControllerC11viewDidLoadyyFTo + 36
11  UIKitCore                           0x00000001bebdbdc4 179501B6-0FC2-344A-B969-B4E3961EBE10 + 3681732
12  UIKitCore                           0x00000001be873e40 179501B6-0FC2-344A-B969-B4E3961EBE10 + 110144
13  UIKitCore                           0x00000001be873b58 179501B6-0FC2-344A-B969-B4E3961EBE10 + 109400
14  UIKitCore                           0x00000001bea601a4 179501B6-0FC2-344A-B969-B4E3961EBE10 + 2126244
15  UIKitCore                           0x00000001bea60098 179501B6-0FC2-344A-B969-B4E3961EBE10 + 2125976
16  UIKitCore                           0x00000001bea5f93c 179501B6-0FC2-344A-B969-B4E3961EBE10 + 2124092
17  UIKitCore                           0x00000001bebb36dc 179501B6-0FC2-344A-B969-B4E3961EBE10 + 3516124
18  test                                0x00000001000b3680 $s4test11AppDelegateC11application_29didFinishLaunchingWithOptionsSbSo13UIApplicationC_SDySo0j6LaunchI3KeyaypGSgtF + 852
19  test                                0x00000001000b3898 $s4test11AppDelegateC11application_29didFinishLaunchingWithOptionsSbSo13UIApplicationC_SDySo0j6LaunchI3KeyaypGSgtFTo + 188
20  UIKitCore                           0x00000001bebb3888 179501B6-0FC2-344A-B969-B4E3961EBE10 + 3516552
21  UIKitCore                           0x00000001bebb2fac 179501B6-0FC2-344A-B969-B4E3961EBE10 + 3514284
22  UIKitCore                           0x00000001bebb1f88 179501B6-0FC2-344A-B969-B4E3961EBE10 + 3510152
23  UIKitCore                           0x00000001bebb1c00 179501B6-0FC2-344A-B969-B4E3961EBE10 + 3509248
24  UIKitCore                           0x00000001bebfc354 179501B6-0FC2-344A-B969-B4E3961EBE10 + 3814228
25  UIKitCore                           0x00000001bebfb3ac 179501B6-0FC2-344A-B969-B4E3961EBE10 + 3810220
26  UIKitCore                           0x00000001bebfb034 UIApplicationMain + 340
27  test                                0x00000001000b5090 main + 64
28  dyld                                0x00000001dad84960 CB3FF411-4762-34D2-86A4-ECA13F9FB6C3 + 88416
2022-11-15 02:46:47.600473-0600 test[8924:1309389] Unknown CIDetectorNumberOfAngles specified. Ignoring.
[error] [MtlResolver::createPlatformTexture] MtlResolver is disabled, returning nullptr.
[error] [MtlResolver::createPlatformTexture] MtlResolver is disabled, returning nullptr.
[error] [MtlResolver::createPlatformTexture] MtlResolver is disabled, returning nullptr.
[error] [MtlResolver::createPlatformTexture] MtlResolver is disabled, returning nullptr.
[error] [MtlResolver::createPlatformTexture] MtlResolver is disabled, returning nullptr.
[error] [MtlResolver::createPlatformTexture] MtlResolver is disabled, returning nullptr.
[error] [MtlResolver::createPlatformTexture] MtlResolver is disabled, returning nullptr.
[error] [MtlResolver::createPlatformTexture] MtlResolver is disabled, returning nullptr.
[error] Error, [LSAGLView::drawTexture] LS::Exception : [LSAGLView] attempt to use deleted framebuffer
Backtrace:
<unavailable>
[error] Error, [LSAGLView::drawTexture] LS::Exception : [LSAGLView] attempt to use deleted framebuffer
Backtrace:
<unavailable>
[error] Error, [LSAGLView::drawTexture] LS::Exception : [LSAGLView] attempt to use deleted framebuffer
Backtrace:
<unavailable>
[error] Error, [LSAGLView::drawTexture] LS::Exception : [LSAGLView] attempt to use deleted framebuffer
Backtrace:
<unavailable>
[error] Error, [LSAGLView::drawTexture] LS::Exception : [LSAGLView] attempt to use deleted framebuffer
Backtrace:
<unavailable>
[error] Error, [LSAGLView::drawTexture] LS::Exception : [LSAGLView] attempt to use deleted framebuffer

... on and on and on ...

    Please let me know if you need anything else! I do not know what the heck LSAGLView is because I have not been able to find any documentation about it online whatsoever and am clueless/lost as to how to even begin debugging this issue.

    Please do note that the working functionality sample app has the same errors, with the exception of the api request timing out (dunno what that is 🤷‍♂️), and up till the [LSAGLView::drawTexture] LS::Exception: ... error

    Please advise.
    Thanks.
    Tushar

  • Tushar
    Tushar Posts: 3
    #5

    I am aware that y'all, Snapchat, have some header file called LSAGLView.h from what I was able to glean online (https://github.com/ipadkid358/Snapchat-Headers/blob/master/LSAGLView.h) which has this same exact -(void)drawTexture:(id)arg1 ; but again lost as to where this file is, why it is attempting to use a deleted framebuffer, and how to go about telling it to stop doing that lol.

  • AliveNow Creative Tech
    AliveNow Creative Tech Posts: 20 🔥
    #6

    Hi @Tushar, and @stevenxu, We are also facing this issue. Did you guys find any solution for this issue?

  • stevenxu
    stevenxu Posts: 612 👻
    #7

    @AliveNow Creative Tech @Tushar

    We don't have an official support for React Native. Sharing with our eng team still to see if they have the bandwidth to look into this though. Will reply here if there's any updates.

  • stevenxu
    stevenxu Posts: 612 👻
    #8

    @AliveNow Creative Tech said:
    Hi @Tushar, and @stevenxu, We are also facing this issue. Did you guys find any solution for this issue?

    Could you give us more details of your issue? ie it's working on android but not iOS?

  • AliveNow Creative Tech
    AliveNow Creative Tech Posts: 20 🔥
    edited January 2023 #9

    @stevenxu said:

    @AliveNow Creative Tech said:
    Hi @Tushar, and @stevenxu, We are also facing this issue. Did you guys find any solution for this issue?

    Could you give us more details of your issue? ie it's working on android but not iOS?

    Yes, it is working on Android but I am facing the issue in IOS that @Tushar faced.

    i.e Backtrace:
    [error] Error, [LSAGLView::drawTexture] LS::Exception : [LSAGLView] attempt to use deleted framebuffer

    I am facing the above issue when I try to integrate a Camera Kit into a new IOS project.

  • arashp
    arashp Posts: 52 🔥🔥
    edited January 2023 #10

    [error] Error, [LSAGLView::drawTexture] LS::Exception : [LSAGLView] attempt to use deleted framebuffer

    We discussed a workaround to this issue on a different thread:
    https://community.snap.com/snapar/discussion/1850/requesting-assistance-for-lsaglview-error-in-camera-kit-ios-app.

  • arashp
    arashp Posts: 52 🔥🔥
    #11

    As mentioned on that thread, besides the workaround, the Camera Kit team is discussing ways of avoiding this issue by restructuring the example provided in the iOS Sample App.

  • stevenxu
    stevenxu Posts: 612 👻
    #13

    WHOA!!! @orbsquare this is awesome. Thank you so much for sharing and contributing for the community. I'll share with our eng team too to take a look when they get a chance.

  • luchogeoj
    luchogeoj Posts: 2
    #14

    @orbsquare hey there, how are you? Hey I am facing this challenge and need to integrate Snapchat into a React Native Bare Project. Have you tried that? Do you have any good documentation on how to do it? Thanks

  • stevenxu
    stevenxu Posts: 612 👻
    #15

    @luchogeoj Apologies for the delayed response here! Currently we don't have an official React Native support. However, here's a community member who recently shared their React Native bridge for Camera Kit you can check out!

Categories